<template>
  <layout-card v-model="search" :filters="exampleOptions"
               headline="信息列表"
               headtitle="数据筛选"
               :hasButton="true"
               :hasTableButton="true" :buttonFilters="buttonOptions" @search-change="searchChange"
               @search-reset="searchReset">
    <template #action>
      <div @click="handleCreate">
        <el-button type="primary" :disabled="!tableData.length">导出</el-button>
      </div>

    </template>
    <table-common stripe="true" :columns="exampleColumns" :loading="loading" :pagination="pager" :table-data="tableData"
                  size="large" @current-change="changeCurrent" @size-change="changePageSize">
    </table-common>
  </layout-card>

</template>

<script lang="ts" setup>
import {computed, ref, onBeforeMount, reactive} from 'vue'

import LayoutCard from '@/components/LayoutCard/index.vue'
import TableCommon from '@/components/TableCommon/index.vue'
import {exampleColumns} from '@/views/pax/flight/config/columns'
import {buttonOptions, exampleOptions} from '@/views/pax/flight/config/filters'

import {flightPageList, exportPageList} from '@/api/pax/flight'
import type {PageListType} from '@/api/pax/flight'

import {ElMessage} from 'element-plus'

var conditions = null
const currentPage = ref(1)
const pageSize = ref(10)
const total = ref(0)

interface FlightType {
  flno: string;
  fexd: string;
  destination: string;
  origin: string;
  lastUpdateTime: string;
  type: string;
  remarks: string;
  operator: string;
}

//查询条件
const searchList = reactive({
  newflno: '',
  newsfaw: '',
  newabrn: ''

})

//保存表单数据
const tableData = ref<FlightType[]>([])

const searchflio = ref('A')
buttonOptions.forEach(e => {
  e.defaultValue = searchflio.value
  e.events.change = function (value, evt) {
    searchflio.value = value
    getData()
  }
})

const pager = computed(() => ({
  currentPage: currentPage.value,
  pageSize: pageSize.value,
  total: total.value,
  pageCount: Math.ceil(total.value / pageSize.value) || 1
}))

const search = ref({})
// 获取数据
const getData = () => {
  const payload: PageListType = {
    pageNum: currentPage.value,
    pageSize: pageSize.value,
    condition: {
      flno: "",
      flio: searchflio.value,
      sfaw: "",
      abrn: "",
    }
  }

  if (conditions !== null) {
    payload.condition = conditions;
  }

  // ...获取数据
  //当前页数据
  flightPageList(payload).then((res) => {
    const list = res.data.list
    list.forEach((e) => {
      e.fexd = e.fexd.substring(0, 10)
      e.lastUpdateTime = e.lastUpdateTime.substring(0, 16)

      e.oldfelt = e.felt
      e.felt = e.felt.substring(11, 16)

      e.oldfeltDelay = e.feltDelay
      e.feltDelay = e.feltDelay.substring(11, 16)

      e.oldfett = e.fett
      e.fett = e.fett.substring(11, 16)

      e.oldfettDelay = e.fettDelay
      e.fettDelay = e.fettDelay.substring(11, 16)

    })
    tableData.value = list
    total.value = res.data.total

  })
}

/**
 * 点击查询
 */
const searchChange = async (data: FilterDataType) => {

  // 赋值保存查询条件 ， 分页等要用
  conditions = {
    flno: data?.flno as string | undefined,
    flio: searchflio.value,
    sfaw: data?.sfaw as string | undefined,
    abrn: data?.abrn as string | undefined,
  }


  const payload: PageListType = {
    pageNum: currentPage.value,
    pageSize: pageSize.value,
    condition: {
      flno: data?.flno?.trim() as string | undefined,
      flio: searchflio.value,
      sfaw: data?.sfaw?.trim() as string | undefined,
      abrn: data?.abrn?.trim() as string | undefined,
    }
  }

  searchList.newflno = payload.condition.flno as string
  searchList.newsfaw = payload.condition.sfaw as string
  searchList.newabrn = payload.condition.abrn as string
  //...获取数据


  const res = await flightPageList(payload);//当前页数据
  const list = res.data.list

  // if(list.length!=0){
  //     ElMessage({
  //     message: '查询成功',
  //     type: 'success',
  //   })
  // }else{
  //     ElMessage({
  //     message: '查询数据不存在',
  //     type: 'error',
  //   })
  // }

  list.forEach((e) => {
    e.fexd = e.fexd.substring(0, 10)
    e.lastUpdateTime = e.lastUpdateTime.substring(0, 16)

    e.oldfelt = e.felt
    e.felt = e.felt.substring(11, 16)

    e.oldfeltDelay = e.feltDelay
    e.feltDelay = e.feltDelay.substring(11, 16)

    e.oldfett = e.fett
    e.fett = e.fett.substring(11, 16)

    e.oldfettDelay = e.fettDelay
    e.fettDelay = e.fettDelay.substring(11, 16)
  })
  tableData.value = list
  total.value = res.data.total
}

/**
 * 点击重置
 * @param data 数据
 */
const searchReset = (data: FilterDataType) => {
  search.value = data
  currentPage.value = 1
  pageSize.value = 10

  conditions = null;
  getData()
}
//分页
const changeCurrent = (value: number) => {
  currentPage.value = value
  getData()
}
const changePageSize = (size: number) => {
  pageSize.value = size
  getData()
}


//获取当前时间
const getCurrentTime = () => {
  const now = new Date();
  const year = now.getFullYear();
  const month = ('0' + (now.getMonth() + 1)).slice(-2);
  const day = ('0' + now.getDate()).slice(-2);
  const formattedTime = `${year}${month}${day}`;
  return formattedTime;
};

//导出数据
const handleCreate = () => {

  const payload = {
    flno: searchList.newflno,
    flio: searchflio.value,
    sfaw: searchList.newsfaw,
    abrn: searchList.newabrn,
  }
  exportPageList(payload).then((res) => {
    const a = document.createElement('a')
    a.href = URL.createObjectURL(new Blob([res]))
    a.download = `不正常航班旅客服务${getCurrentTime()}.xlsx`
    a.click()
  })
}
// onBeforeMount(getData)
onBeforeMount(() => {
  searchflio.value = "A"
  getData()
})
</script>

<style>
.out {
  z-index: 1000;
  transform: translateY(56px);
}

.my-radio-btn {
  transform: translateX(-100px)
}
</style>
